import { ProductService } from './shared/product.service';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { Routes, RouterModule} from '@angular/router';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { HashLocationStrategy, LocationStrategy } from '@angular/common';

import { AppComponent } from './app.component';
import { NavbarComponent } from './navbar/navbar.component';
import { FooterComponent } from './footer/footer.component';
import { SearchComponent } from './search/search.component';
import { CarouselComponent } from './carousel/carousel.component';
import { ProductComponent } from './product/product.component';
import { StarsComponent } from './stars/stars.component';
import { ProductDetailComponent } from './product-detail/product-detail.component';
import { HomeComponent } from './home/home.component';
import { FilterPipe } from './pipe/filter.pipe';

import {WebsocketService} from './shared/websocket.service';

const routeConfig: Routes = [
	{
		path: '', component: HomeComponent
	},
	{
		path: 'product/:productId', component: ProductDetailComponent
	}
];

@NgModule({
	declarations: [
		AppComponent,
		NavbarComponent,
		FooterComponent,
		SearchComponent,
		CarouselComponent,
		ProductComponent,
		StarsComponent,
		ProductDetailComponent,
		HomeComponent,
		FilterPipe
	],
	imports: [
		BrowserModule,
		ReactiveFormsModule,
		HttpModule,
		FormsModule,
		RouterModule.forRoot(routeConfig)
	],
	providers: [ProductService, WebsocketService, {
		provide: LocationStrategy,
		useClass: HashLocationStrategy
	}],
	bootstrap: [AppComponent]
})
export class AppModule { }
